<template>
	<view class="withdraw">
		<view class="top">
			<text>账户余额</text>
			<text>12.00</text>
		</view>
		<view class="tip">
			<text>提现金额</text>
			<text>本月还可提现2次</text>
		</view>
		<view class="input">
			<view class="input-l">¥</view>
			<view class="input-c"><input type="text" value="" /></view>
			<view class="input-r">全部提现</view>
		</view>
		<view class="rule">提现规则</view>
		<view>
			<button class="btn">确认</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style>
.withdraw {
	width: 100%;
	height: 100%;
	position: absolute;
	background-color: #f3f3f3;
	font-size: 26upx;
}
.top {
	width: 100%;
	height: 240upx;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: #fff;
}
.top text:first-child {
	font-size: 24upx;
	margin-bottom: 20upx;
}
.top text:last-child {
	font-size: 60upx;
	color: #333;
	margin-bottom: 20upx;
}
.tip {
	height: 60upx;
	line-height: 60upx;
	background-color: #fff;
	padding: 0 30upx;
	overflow: hidden;
}
.tip text:first-child {
	font-size: 34upx;
	float: left;
}
.tip text:last-child {
	float: right;
	color: #999;
}
.input {
	width: 100%;
	background-color: #fff;
	padding: 20upx 30upx;
	display: flex;
	height: 150upx;
	line-height: 100upx;
}
.input .input-l {
	width: 60upx;
	font-size: 60upx;
}
.input .input-c {
	flex: 1;
}
.input .input-c input {
	width: 100%;
	height: 100upx;
	line-height: 100upx;
	border-bottom: 1px solid #ccc;
	font-size: 34upx;
}
.input .input-r {
	color: #F52A4C;
	font-size: 34upx;
	width: 160upx;
	text-align: center;
	margin-left: 20upx;
}
.rule {
	padding: 30upx;
}
.btn {
	width: 90%;
	background-color: #F52A4C;
	color: #fff;
	margin-top: 50upx;
}
</style>
